<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>计算器</title>
    <style>
        input{
            background: #E8E8E8;
            width: 100px;
        }
    </style>
    <script>
        function add1() {
           var num1= document.getElementById("put1").value;
           console.log(num1);
           var num2 = document.getElementById("put2").value;
           console.log(num2);
          num1 = parseFloat(num1);
          num2 = parseFloat(num2);
          result = num1 + num2;
            console.log(result);
           document.getElementById("put3").value = result;
        }

    </script>
</head>
<body>
<input type="text" id="put1" > +
<input type="text" id="put2" >=
<input type="text" id="put3">
<button type="button" onclick="add1()">add</button>
</body>
</html>